/**
 * add by: hong.rong 2020/08/16
 * name:
 * notes:
 */

import React from 'react'
import { Empty } from 'antd'
import { isArray } from 'lodash'
import {
  List as VList,
  AutoSizer,
  CellMeasurer,
  CellMeasurerCache,
} from 'react-virtualized'
import Row from './Row'
import styles from './index.less'

const cache = new CellMeasurerCache({ defaultHeight: 75, fixedWidth: true })

export default function Table({ dataSource }) {
  if (!isArray(dataSource) || (dataSource || []).length === 0) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
  }

  /**
   * 渲染行数据
   * @param index
   * @param key
   * @param parent
   * @param style
   * @returns {*}
   */
  const cellRenderer = ({ index, key, parent, style }) => {
    const item = (dataSource || [])[index] || {}
    return (
      <CellMeasurer
        cache={cache}
        columnIndex={0}
        key={key}
        parent={parent}
        rowIndex={index}
      >
        <div
          style={{
            ...style,
            height: 70,
            whiteSpace: 'nowrap',
          }}
        >
          <Row item={item} type={item.type} />
        </div>
      </CellMeasurer>
    )
  }
  return (
    <div>
      <div className={styles['title']}>最近提交</div>
      <div style={{ height: 450 }}>
        <AutoSizer>
          {({ height, width }) => (
            <VList
              height={height}
              rowCount={(dataSource || []).length}
              rowHeight={75}
              rowRenderer={cellRenderer}
              width={width}
              style={{ paddingRight: 10 }}
            />
          )}
        </AutoSizer>
      </div>
    </div>
  )
}
